<%@ page language="java" contentType="text/html; charset=UTF-8"
	pageEncoding="UTF-8"%>
<%@ include file="/static/common/inner-header.jspf"%>
<title>授权</title>
<style type="text/css">
body{
	padding:0px;
	margin:0px;
}
.foreignBox{
	margin:0 auto;
	padding-top:30px;
	width:80%;
	background:gray;
	font-size:20px;
}
</style>
<script type="text/javascript">
	$(function(){
		$(".foreignBox").css({"height":$(window).height()+"px"});
		$("ul").css({"list-style":"none"});
		$(".foreignUl").css({"display":"block","margin":"0 auto"});
	});
	$(function() {
		$(":checkbox").bind("click",function() {
			// 判断复选框是否选中
			//alert($(this).is(":checked"));
			//alert($(this).next().next().find("input:checkbox").length);
			$(this).next().next().find("input:checkbox").prop("checked",$(this).is(":checked"));
		});
		
		$(".child > li").find(":checkbox").bind("click",function() {
			// 找到当前节点上面的父节点的父节点下面所有的选中的复选框个数
			var count = $(this).parent().parent().find("input:checked").length;
			//alert($(this).parent().parent().parent().children(":checkbox").attr("name"));
			var $parentNode = $(this).parent().parent().parent().children(":checkbox");
			if(count==0) {
				$parentNode.prop("checked",false);
			} else {
				$parentNode.prop("checked",true);
			}
		});
		
		// 点击授权按钮操作
		$("#submit").bind("click",function() {
			// 获取所有选中的复选框对象数组
			var menuString="";
			$("ul").find("input:checked").each(function() {
				menuString+=$(this).val()+",";
			});
			menuString = menuString.substr(0,menuString.length-1);
			
			location.href="${pageContext.request.contextPath}/role/RoleServlet?command=grant&menuString="+menuString+"&roleId=${roleId}";
		});
	});
</script>
</head>
<body>
	<div class="foreignBox">
		<ul class="foreignUl">
			<c:forEach items="${allMainMenuList }" var="mainMenu">
				<li>
					<c:set var="flag" value="true" />
					<c:forEach items="${mainMenuList }" var="roleMainMenu">
						<c:if test="${roleMainMenu.id==mainMenu.id }">
							<input type="checkbox" checked="checked" name="main" id="main${mainMenu.id }" value="${mainMenu.id }" /><label for="main${mainMenu.id }">${mainMenu.name}</label>
							<c:set var="flag" value="false" />
						</c:if>
					</c:forEach>
					<c:if test="${flag}">
						<input type="checkbox" name="main" id="main${mainMenu.id }" value="${mainMenu.id }" /><label for="main${mainMenu.id }">${mainMenu.name}</label>
					</c:if>
					<ul class="child">
						<c:forEach items="${allChildMenuList }" var="childMenu">
							<c:if test="${childMenu.pid == mainMenu.id }">
								<li>
									<c:set var="flag" value="true" />
									<c:forEach items="${childMenuList }" var="roleChildMenu">
										<c:if test="${roleChildMenu.id== childMenu.id }">
											<input type="checkbox" checked="checked" name="child" id="child${childMenu.id }" value="${childMenu.id }" /><label for="child${childMenu.id }">${childMenu.name}</label>
											<c:set var="flag" value="false" />
										</c:if>
									</c:forEach>
									<c:if test="${flag }">
										<input type="checkbox" name="child" id="child${childMenu.id }" value="${childMenu.id }" /><label for="child${childMenu.id }">${childMenu.name}</label>
									</c:if>
								</li>
							</c:if>
						</c:forEach>
					</ul>
						
				</li>
			</c:forEach>
		</ul>
		<input id="submit" type="button" value="授权" />
	</div>
</body>
</html>